<template>
  <div class="text-omit">
    <span>{{open && isOpen?text:newText}}</span>
    <span v-if="text.length>max">
      {{isOpen?'':'...'}}
      <a class="link" v-if="open" @click="isOpen=!isOpen">{{isOpen?'收起':'展开'}}</a>
    </span>
  </div>
</template>

<script>
export default {
  props: {
    text: {
      type: String,
      default: ''
    },
    max: {
      type: [Number, String],
      default: 60
    },
    open: {
      type: Boolean,
      default: true
    }
  },
  computed: {
    newText: function () {
      return this.text ? this.text.split('').splice(0, this.max).join('') : ''
    }
  },
  data () {
    return {
      isOpen: false
    }
  }
}
</script>

<style lang="scss">
</style>
